此系列適合誰看？

想要當切版人員的人，或是剛開始切版工作的人。

前情提要-為什麼你要來切版?

切版這個東西到底是什麼？切版的人員又算是什麼角色？

可能最直接的答案會是HTML+CSS。

但事實上切版這個技術遠遠大於這兩個"語言"。

切版的人員又算是什麼角色？就只是把設計稿弄成.html檔案嗎？

事實上你可以說他是一個前端最底層的結構工程師，他是一種美學藝術家，
或是一種工匠的職人精神。

你聽過的切版是什麼？你做過什麼切版？

大家玩前端的人可能都切過版，沒切過版也聽過切版這件事。
我講了這麼多，我想要說的事情是，切版最重要的事情反而不是HTML+CSS，而是設計稿！

現代資訊這麼多，大家都可以在網路上找到很多模板或是YT影片練習。
可是真的切版是看著影片打打code嗎？
切版是你看了一個鬍鬚張還是一個蘋果的官網，就右鍵檢查去學習，模仿一個嗎？

錯！

如果要我說切版的重要性，我會說三個字：設計稿！設計稿！設計稿！

Pixel Perfect 完美對照設計稿的重要性

If you're not familiar with the term, "pixel-perfection" is the idea that your HTML/CSS implementation should be as close to the original mockup as possible. Measurements and spacing should be exact, down to the pixel.

ChatGPT翻譯:「『畫素級完美』（pixel-perfection）指的是 HTML/CSS 的實作必須盡可能貼近原始設計稿，所有尺寸與間距都應精確到像素級別。」

摘自:Chasing the Pixel-Perfect Dream

切版的意義我可以一句話講完：把網頁切的跟設計稿，一模一樣。

不是差不多，也不是要87%像，也不是95加滿，而是要百分之百一模一樣。

這可不是什麼資深的前端人員的工作標準，這就是完完全全的基本功。

但為了要達到這樣pixel perfect的效果(還原設計稿)，
我們需要培養很多的專業技術、使用工具、正確心態、順暢的工作流程。

以上四項缺一不可。

未來的文章規劃-後設觀察、後設學習

這個系列定調的風格與撰寫內容就是，不會把太多基礎HTML與CSS的內容解釋出來，
那些知識點可以很輕易的google到太多的文章，懶得谷歌AI整理更快。
所以我比較想要強調：「從切版入門工程師」的角度出發，去漫談一些經驗跟觀點、分享工具，
當然也可能會有一些業界的鬼故事，或是說自學這條路到底哪些方向是對，哪些方向是錯？

比較是以「分享道路讓你選擇方向>告訴你知識要你努力塞」這樣的角度切入。

此系列文章的意義-輸出與輸入相同的重要

讓沒有切版技術的人學會切版的技術，了解觀念，學到有什麼好用的工具，培養哪些心態。
以及該如何建構自己順暢的切版流程。

當然小弟本人我只是一介莽夫，並不是什麼大神，
所分享的內容僅是拙見，若有各路大神歡迎指教。

寫這篇文章的目的當然也是透過"費曼學習法"，讓自己有一個輸出，重新內化整合知識。

另外也是要發揚推廣切版的偉大，
切版人員的辛苦，創造一個共同的社群空間，使得大家可以取暖(誤)